#!/bin/bash

# 网站脚本前面必须这样写
echo "Content-Type:text/html;"
echo ""
echo "<meta charset="utf-8">"
# mysql -h10.10.10.81 -ujxadmin -p123456 jxcms -e "select * from jx_stu"

echo '
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
  }
  .container {
    background-color: white;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    max-width: 1000px;
    width: 100%;
  }
  table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
  }
  th, td {
    padding: 10px;
    text-align: left;
    border-bottom: 1px solid #ddd;
  }
  th {
    background-color: #f2f2f2;
  }
</style>
<title>学生列表</title>
</head>
<body>
  <div class="container">
    <h1>学生列表</h1>
    <table>
      <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>班级</th>
        <th>年龄</th>
      </tr>
'
for ((i=1;i<=20;i++)); do
  # 获取第i行
  user=$(cat /etc/passwd | sed -n $i"p")
  # 获取用户ID
  id=$(echo $user | awk -F ":" '{print $3}')
  name=$(echo $user | awk -F ":" '{print $1}')
  class=$(echo $user | awk -F ":" '{print $7}')
  age=$(echo $user | awk -F ":" '{print $4}')
  echo "
        <tr>
          <td>$id</td>
          <td>$name</td>
          <td>$class</td>
          <td>$age</td>
        </tr>
  "
done

echo '
      <!-- 添加更多的学生信息行 -->
    </table>
  </div>
</body>
</html>
'


